<template>
    <div class="containt">
      <div class="top">
        <nav-com
        title="详情"
        :showView='showView'
        @back="backHandler()"
      >
      </nav-com>
       <!-- 数据统计 -->
       <div style="margin:10px;margin-top: 20px;background:#fff;border-radius: 5px;padding: 15px;padding-top: 0px!important;">
            <div style="color: rgb(34, 34, 34); line-height: 50px; border-bottom: 1px solid #E7E7E7;">数据统计</div>
             <div style="display: flex;justify-content: space-between;">
                <div style=" ">
                    <div style="color:#999999;font-size:13px;line-height: 30px;">总人数</div>
                    <div style="font-size:18px;line-height: 30px;">{{userDetail.all_nums}}</div>
                </div>
                <div style="">
                    <div style="color:#999999;font-size:13px;line-height: 30px;">总积分</div>
                    <div style="font-size:18px;line-height: 30px;">{{userDetail.all_score}}</div>
                </div>
                
                <div style="">
                    <div style="color:#999999;font-size:13px;line-height: 30px;">总金额</div>
                    <div style="font-size:18px;line-height: 30px;">{{userDetail.all_price}}</div>
                </div>
             </div>   

             <div style="display: flex;line-height: 40px;margin-top: 20px;background: #F8F8F8;padding: 10px 20px;border-radius: 10px;color: #999999;font-size: 14px;">
                <div style="flex:1">
                    <div>金牌人数:{{userDetail.all_jin}}</div>
                    <div>二星网店主:{{userDetail.all_xing2}}</div>
                    <div>代言人:{{userDetail.all_daiyan}}</div>
                
                </div>
                <div style="flex:1">
                    <div>银牌人数:{{userDetail.all_yin}}</div>
                    <div>一星网店主:{{userDetail.all_xing1}}</div>
                    <div>推广员:{{userDetail.all_tuiguang}}</div>
              
                </div>
             </div>
       </div>
       <!-- 数据统计 -->
       <!-- 个人信息 -->
       <div style="margin:10px;margin-top: 15px;background:#fff;border-radius: 5px;padding: 15px;padding-top: 0px!important;">
            <div style="color: rgb(34, 34, 34); line-height: 50px; border-bottom: 1px solid #E7E7E7;">个人信息</div>
            <div>
                <div class="item">
                    <div class="title">姓名</div>
                    <div class="value">{{userDetail.user.nickname}}</div>
                </div>
                <div class="item">
                    <div class="title">手机号</div>
                    <div class="value">{{userDetail.mobile | mobileFilter}}</div>
                </div>
                <div class="item">
                    <div class="title">角色</div>
                    <div class="value">{{userDetail.role | roleType}}</div>
                </div>
                <!-- <div class="item">
                    <div class="title">所属部门</div>
                    <div class="value">{{userDetail.role_type}}</div>
                </div> -->
                <!-- <div class="item">
                    <div class="title">添加时间</div>
                    <div class="value">{{userDetail.addtime | dateFormat}}</div>
                </div> -->
                <div class="item">
                    <div class="title">邀请人手机号</div>
                    <div class="value">{{userDetail.inviter_mobile | mobileFilter}}</div>
                </div>
                <div class="item">
                    <div class="title">直接负责人手机号</div>
                    <div class="value">{{userDetail.parent_mobile | mobileFilter}}</div>
                </div>
                <div class="item">
                    <div class="title">账户状态</div>
                    <div class="value">{{userDetail.user.status  | userStatus }}</div>
                    
                </div>
                <div class="item">
                    <div class="title">可提现金额</div>
                    <div class="value">{{userDetail.price}}</div>
                </div>
                <!-- <div class="item">
                    <div class="title">所在部门</div>
                    <div class="value">{{userDetail.role_type | roleType}}</div>
                </div> -->
                <!-- <div class="item">
                    <div class="title">团队1</div>
                    <div class="value">{{userDetail.role1 | roleType}}</div>
                </div>
                <div class="item">
                    <div class="title">团队2</div>
                    <div class="value">{{userDetail.role2 | roleType}}</div>
                </div>
                <div class="item">
                    <div class="title">团队3</div>
                    <div class="value">{{userDetail.role3 | roleType}}</div>
                </div>
                <div class="item">
                    <div class="title">联创伙伴</div>
                    <div class="value">{{userDetail.is_union==0?"否":"是"}}</div>
                </div>
                <div class="item">
                    <div class="title">独立负责人标识</div>
                    <div class="value">{{userDetail.user_flags}}</div>
                </div> -->
            </div>
        </div>
       <!-- 个人信息 -->
      </div>  
       <!-- 操作 -->
       <div class="bottomBtn" >
        <!-- <div class="bottomBtn" v-if="operType==1"> -->
            <div class="djBt" v-if="userDetail.user.status == 'normal' " @click="disable()">冻结账号</div>
            <div class="czBt" @click="resetPwd3()">重置密码</div>
       </div>
        <!-- 操作 -->
    </div>
  </template>
  
  <script>
  import moment from "moment";
  import { getBagIdItem2,yiPayTip,userDetail,resetPwd3, disable, userdel } from "@/api/api";
  import navCom from "@/component/nav";
import { Toast } from "vant";
  export default {
    components: {
      navCom,
    },
    filters: {
      mobileFilter(val) {
      if (val == "" || val == undefined) {
        return "无";
      }
      let tell = /(\d{3})\d*(\d{4})/;
      let num = val.replace(tell, "$1****$2");

      return num;
    },
      userStatus(val){
        if(val=="normal"){
          return "正常";
        }
        if(val=='freeze'){
          return "冻结";
        }
        if(val=="forbidden"){
          return "禁用";
        }
        if(val=='pending'){
          return "待审核";
        }
      },
    dateFormat(val) {
      return moment(val * 1000).format("YYYY-MM-DD HH:mm:ss");
    },

    typeName(val) {
      var rewardType = ['零售收益', '批发收益', '日广告收益', '周广告收益', '多商户进货成本', '多商户一星网点分佣'];
      return rewardType[(val - 1)]
    },
    roleType(val) {
      if(val==0){
        return "无"
      }
      var roleType = ['推广员', '代言人', '一星网店经销商', '二星网店经销商', '银牌经销商', '金牌经销商', '钻石经销商']
      return roleType[(val-1)]
    },
  },
    data() {
      return {
        operType:0,
        showView: true,
        list: [],
        one_day: 1,
        userDetail:{}
      };
    },
    created() {
      this.init();
      this.operType=this.$route.params.operType;
      // this.isTip()
    },
    methods: {
      resetPwd3(){
       this.$dialog
          .alert({
            title: "重置密码",
            message:
              "确认要重置密码为 123456 吗？",
            showCancelButton: true,
            confirmButtonText: "确认重置",
          })
          .then(() => {
            resetPwd3({
              user_id: this.$route.params.userId,
            }).then((res) => {
                Toast(res.data.msg);
            });
          });
      },
      disable(){
       this.$dialog
          .alert({
            title: "冻结账号",
            message:
              "确认要冻结账号:"+this.userDetail.mobile+" 吗？",
            showCancelButton: true,
            confirmButtonText: "确认冻结",
          })
          .then(() => {
            disable({
              user_id: this.$route.params.userId,
            }).then((res) => {
                Toast(res.data.msg);
            });
          });
      },
      backHandler() {
        if(weixin.isAndroid()){
          window.JS_TROOPS.goBack()
        }else{
          this.$router.go(-1);
        }
        
      },
      //跳转详情
      handerDetails(id) {
        this.$router.push({
          name: "odersDetails",
          params: { id: id, one_day: 0 },
        });
      },
      //初始化s
      init() {
        userDetail({
          user_id: this.$route.params.userId,
        }).then((res) => {
          this.userDetail = res.data.data;
        });
      },
    },
  };
  </script>
  
  <style scoped>
     /deep/ body{
         background-color: #F8F8F8!important;
    }
    .containt{
        background-color: #F8F8F8!important;
        min-height: 100vh;
    }
    /deep/ .back_box{
        background: transparent!important;
        box-shadow: none!important;
        color: white;
    }
    /deep/ #id{
        min-height: 100vh;
        background-color: #F8F8F8!important;
    }
    .top{
        background-image: linear-gradient(to bottom, #EE6634, #F8F8F8);
        background-size: 100% 35%;
        background-repeat: no-repeat;
        padding-bottom: 100px;
    }
    .item{
        display: flex;
        justify-content: space-between;
        line-height: 30px;
    }
    .title{
        color: #333333;
        font-size: 14px;
    }
    .value{
       color:#999999;
       font-size: 14px;
    }
    .bottomBtn{
        position: fixed;
        bottom: 0px;
        background: #fff;
        width: 100vw;
        display: flex;
        justify-content: space-around;
        padding: 10px 0;
        box-shadow: 0px -2px 9px 0px rgba(236,236,236,0.5);
    }
    .djBt{
        padding: 10px 40px;
        border: 1px solid #666666;
        border-radius: 50px;
        color: #434343;
    }
    .czBt{
        padding: 10px 40px;
        border: 1px solid #FB7647;
        border-radius: 50px;
        color: #FB7647;
    }
  </style>